<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>蒋琼浩</title>
  </head>
  <body>
    <script src="js/echarts.min.js"></script>
    <script src="js/echarts-gl.min.js"></script>
    <script src="js/zhejiang.js"></script>
    <div id="main" style="width: 600px; height: 400px"></div>
    <script type="text/javascript">
      var myChart = echarts.init(document.getElementById("main"));
      var dataX, dataY, dataZ;
      var dataTest = [];
      for (var i = 0; i < 100; i++) {
        dataX = Math.floor(100 * Math.random());
        dataY = Math.floor(100 * Math.random());
        dataZ = Math.floor(100 * Math.random());
        dataTest[i] = [dataX, dataY, dataZ];
      }
      var option = {
        grid3D: [{}],
        xAxis3D: [{}],
        yAxis3D: [{}],
        zAxis3D: [{}],
        series: [
          {
            type: "scatter3D",
            data: dataTest,
          },
        ],
        title: {
          show: true,
          text: "蒋琼浩",
          subtext: "效果展示",
          textstylr: {
            color: "red",
            fontsize: 22,
          },
        },
        legend: {
          show: true,
          left: "right",
          top: "top",
          width: "auto",
          height: "auto",
          orient: "vertical",
          align: "auto",
          textstyle: {
            colir: "green",
            fontsize: 12,
          },
          data: {
            name: "series.name",
            icon: "rect",
          },
          animation: true,
        },
        visualMap: {
          type: "continuous",
          right: 10,
          top: "center",
          itemWidth: 10,
          itemWidth: 20,
          min: 1,
          max: 9,
          range: [2, 6],
          calculabel: true,
          orient: "vertical",
          text: ["max", "min"],
        },
      };

      myChart.setOption(option);
    </script>
  </body>
</html>
